<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>来款组成</title>
  <link rel="stylesheet" type="text/css" href="assets/css/comm.css" />
  <link rel="stylesheet" type="text/css" href="assets/js/src/css/layui.css" />
  <link rel="stylesheet" type="text/css" href="assets/css/navigation.css" />
  <link rel="stylesheet" type="text/css" href="assets/css/compositionIncomingPayment.css" />

</head>

<body>
  <div class="container">
    <div class="navigation before">
    </div>
    <div class="content">
      <header class="">
        <div class="left">
          <div class="">
            <h2>来款组成</h2>
            <div class="">
              <a href="DSS-index.html">DSS首页</a> - <a href="projectRevenueExpenditure.html">项目收支</a> - <span>来款组成</span>
            </div>
          </div>
        </div>
        <div class="right">
          <div class="search">
            <div class="year">
              <p>时间：</p>
              <input type="text" name="" id="year" value="" />
            </div>
            <div class="section">
              <p>部门：</p>
              <div class="sector">
                <div class="">
                  <span></span>
                </div>
              </div>
              <div class="options">
                <div class="all">
                  <i></i>
                  <p>全所</p>
                </div>
              </div>
            </div>
          </div>
          <time></time>
          <div class="menu">
            <a class="goBack" href="javascript:goFront();">前往后台</a>
            <div class="user">
              <p>A</p>
              <div class="">
                <a href="change-password.html">修改密码</a>
                <a href="login.html">退出登录</a>
              </div>
            </div>
          </div>
        </div>
      </header>
      <div class="wrapper">
        <div class="costComposition-con" style="margin-bottom: 16px;">
          <div class="costComposition-item">
            <h2 class="name1">期初结余</h2>
            <div style="display: flex; width: 100%; height: 100%;">
              <div id="OpeningBalance"></div>
              <div class="label">
                <div class="totol">
                  <div style="color:#4E5969; font-size: 16px;">总计</div>
                  <p><span class="totolNum1"> </span> 亿元</p>
                </div>
                <div class="label-item">
                  <div style="border-left:4px solid #165DFF; ">
                    <span>纵向</span>
                    <p> <span class="zongxiang1"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #50CD89; ">
                    <span>军二品</span>
                    <p> <span class="junerpin1"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #FFC107; ">
                    <span>预研</span>
                    <p> <span class="yuyan1"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #722ED1; ">
                    <span>民品</span>
                    <p> <span class="minpin1"> </span> %</p>
                  </div>
                </div>
              </div>
            </div>

          </div>
          <div class="costComposition-item" style="margin-right: 0;">
            <h2 class="name2">本期来款</h2>
            <div style="display: flex; width: 100%; height: 100%;">
              <div id="CurrentPayment"></div>
              <div class="label">
                <div class="totol">
                  <div style="color:#4E5969; font-size: 16px;">总计</div>
                  <p><span class="totolNum2"> </span> 亿元</p>
                </div>
                <div class="label-item">
                  <div style="border-left:4px solid #165DFF; ">
                    <span>纵向</span>
                    <p> <span class="zongxiang2"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #50CD89; ">
                    <span>军二品</span>
                    <p> <span class="junerpin2"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #FFC107; ">
                    <span>预研</span>
                    <p> <span class="yuyan2"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #722ED1; ">
                    <span>民品</span>
                    <p> <span class="minpin2"> </span> %</p>
                  </div>
                </div>
              </div>
            </div>

          </div>
        </div>
        <div class="costComposition-con">
          <div class="costComposition-item">
            <h2 class="name3">本期结算</h2>
            <div style="display: flex; width: 100%; height: 100%;">
              <div id="CurrentSettlement"></div>
              <div class="label">
                <div class="totol">
                  <div style="color:#4E5969; font-size: 16px;">总计</div>
                  <p><span class="totolNum3"> </span> 亿元</p>
                </div>
                <div class="label-item">
                  <div style="border-left:4px solid #165DFF; ">
                    <span>纵向</span>
                    <p> <span class="zongxiang3"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #50CD89; ">
                    <span>军二品</span>
                    <p> <span class="junerpin3"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #FFC107; ">
                    <span>预研</span>
                    <p> <span class="yuyan3"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #722ED1; ">
                    <span>民品</span>
                    <p> <span class="minpin3"> </span> %</p>
                  </div>
                </div>
              </div>
            </div>

          </div>
          <div class="costComposition-item" style="margin-right: 0;">
            <h2 class="name4">本期末结算</h2>
            <div style="display: flex; width: 100%; height: 100%;">
              <div id="ClosingSettlement"></div>
              <div class="label" style="margin-top: 10%;">
                <div class="totol">
                  <div style="color:#4E5969; font-size: 16px;">总计</div>
                  <p><span class="totolNum4"> </span> 亿元</p>
                </div>
                <div class="label-item">
                  <div style="border-left:4px solid #165DFF;">
                    <span>纵向</span>
                    <p> <span class="zongxiang4"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #50CD89; ">
                    <span>军二品</span>
                    <p> <span class="junerpin4"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #FFC107; ">
                    <span>预研</span>
                    <p> <span class="yuyan4"> </span> %</p>
                  </div>
                  <div style="border-left:4px solid #722ED1; ">
                    <span>民品</span>
                    <p> <span class="minpin4"> </span> %</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>


  <script src="assets/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
  <script src="assets/js/http/api.js" type="text/javascript" charset="utf-8"></script>
  <script src="assets/js/test.js" type="text/javascript" charset="utf-8"></script>
  <script src="assets/js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
  <script src="assets/js/src/layui.js" type="text/javascript" charset="utf-8"></script>
  <script src="assets/js/navigation.js" type="text/javascript" charset="utf-8"></script>
  <script src="assets/js/compositionIncomingPayment.js" type="text/javascript" charset="utf-8"></script>

</body>

</html>